<template>
  <!-- 导航栏 -->
  <view class="container">
    <block class="fixed_header">


      <view class="header">

        <view :style="{color:item.isclick ==true?'white':'blue',backgroundcolor:item.isclick ==true?'blue':'white' }"
          @click="changtab(i)" v-for="(item,i ) in tab" :key="i" class="historyl"> {{item.name}}</view>
        <!-- <view class="account" click="myaccount"> 账单总计</view> -->
      </view>
    </block>
    <view class="content" :style="{height:wh+'px'}">
      <my-browse class="content_item" :style="{display: active== 0? 'block':'none'}">商品浏览记录</my-browse>
      <my-account class="content_item" :style="{display: active== 1? 'block':'none'}">我的账单</my-account>
    </view>
  </view>
</template>

<script>
import { log } from 'util'
export default {
  data () {
    return {
      tab: [{ id: 1, name: '我的足迹', isclick: false }, { id: 2, name: '账单总计', isclick: false }],
      active: '0',
      oldlist: [],
      index: 0.,
      wh: ''
    }
  },
  onLoad () {
    this.wh = uni.getSystemInfoSync().windowHeight - 70
  },
  methods: {
    changtab (e) {
      // console.log(e);
      this.active = e


    },
    getSystemInfoSync () {

      log(this.wh)
    }
    // uni.syste

  }

}
</script>

<style lang="scss">
.fixed_header {
  position: fixed;
  left: 0;
  top: 0;
}

.header {

  display: flex;
  margin-top: 10px;

}

.account {
  width: 50%;
  text-align: center;
  line-height: 50px;
  border: 1px solid lightgray;
  border-radius: 45px;
}

.historyl {
  width: 50%;
  height: 50px;
  line-height: 50px;
  text-align: center;
  border: 1px solid lightgray;
  border-radius: 45px;
}

.content {
  background-color: white;
  margin-top: 10px;

  height: 900rpx;

  .content_item {
    text-align: center;
  }
}
</style>
